<!--
为什么要清除浮动？
    很多情况下父盒子不方便设置高度，应该让父盒子高度随内容改变而改变（自适应高度，而不是固定死的）；
    但是里面的子盒子浮动时，不占用原文档流的位置，导致父盒子高度变为0，
    此时会影响后面的元素排版，也就是脱标现象：浮动盒子压着标准流盒子！
解决方案就是清除浮动！


清除浮动的本质
    - 本质：
        清除浮动元素脱离标准流造成的影响
    - 父盒子自身有高度的情况：
        是不需要清除浮动的，毕竟没有浮动带来的影响
    - 父盒子高度没有设置的、属于自适应高度的情况：
        清除浮动后，让父盒子根据子盒子高度自动检测高度，
        并设置父盒子高度为检测出的高度，这样就能消除浮动带来的影响了


清除浮动的语法
    clear
        - left
        - right
        - both

清除浮动的策略：闭合浮动
    将所有浮动元素限制（闭合）在父盒子中。
    只让浮动在父盒子中有影响，不会影响父盒子外的其它盒子。

具体做法：四种
    1）额外标签法（隔墙法）         // W3C推荐的，但下面三种才是开发中最常用的。。
    2）父盒子添加overflow属性
    3）父盒子添加::after伪元素
    4）父盒子添加双伪元素
-->